<!-- 新增进口订单 -->
<template>
  <!-- <div > -->
    <el-dialog width="1100px" class="new-import-order-dialog" top="2vh" title="新增订单" :append-to-body="true" :visible="myVisible" @close="close" v-loading="loadingViewAll"
      element-loading-target="document.getElementById('onelyLodningView')"
      element-loading-text="正在加载..."
      element-loading-spinner="el-icon-loading"
      element-loading-background="rgba(0, 0, 0, 0.1)">
      <div v-loading="loadingView"
      element-loading-text="正在加载..."
      element-loading-spinner="el-icon-loading"
      element-loading-background="rgba(0, 0, 0, 0.1)">
      <div class="dialog-footer">
        <el-button @click="close" size="mini">取 消</el-button>
        <el-button type="primary" @click="add" size="mini">确 定</el-button>
      </div>
      <div>
      <el-form :model="publicData24" label-width="100px" size="mini">
        <el-row>
          <el-col :span="8">
            <el-form-item label="用箱人：">
              <el-select v-model="publicData24.customerId" @change="customerChange" filterable placeholder="请选择" style="width: 170px; height: 28px; line-height: 28px;">
                <el-option v-for="item in kehuOptions" :key="item.UserId" :label="item.search" :value="item.UserId">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="提单号：">
              <el-input style="width: 170px; height: 28px; line-height: 28px;" v-model="publicData24.blno"></el-input>
              <el-button
                  type="primary"
                  @click="getBoatComBlon"
                  icon="el-icon-refresh"
                  circle
                ></el-button>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="费用状态：">
              <el-select v-model="publicData24.boxFeeStatus" style="width: 170px; height: 28px; line-height: 28px;">
                <el-option label="未结账" value="0"></el-option>
                <el-option label="已结账" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="到港时间：">
              <el-date-picker
              style="width: 170px; height: 28px; line-height: 28px;"
                value-format="yyyy-MM-dd"
                v-model="publicData24.timeArrival"
                type="date"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="船名：">
              <el-autocomplete
              style="width: 170px; height: 28px; line-height: 28px;"
                  v-model="publicData24.boat"
                  :fetch-suggestions="shipSearch"
                  @select="chuanmingChange"
                  placeholder="请输入船名"
                >
                  <template slot-scope="{ item }">
                    <div>{{ item.value = item.sbv }}</div>
                  </template>
                </el-autocomplete>
                <el-tooltip class="item" effect="dark" content="如未找到所需船名/航次，请点击此按钮" placement="top">
                  <el-button
                    type="primary"
                    @click="getBoatIofnJH"
                    icon="el-icon-refresh"
                    circle
                  ></el-button>
                </el-tooltip>
                <!-- <el-select v-model="publicData24.boat" @change="chuanmingChange" filterable placeholder="请选择船名">
                  <el-option
                    v-for="item in chuanmingOptions"
                    :key="item.shipName"
                    :label="item.shipName"
                    :value="item.shipName"
                  ></el-option>
                </el-select> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="航次：">
              <!-- <el-input v-model="publicData24.voyage" style="width: 170px; height: 28px; line-height: 28px;" auto-complete="off"></el-input> -->
              <el-autocomplete style="width: 170px; height: 28px; line-height: 28px;"
                    v-model="publicData24.voyage"
                    :clearable="true"
                    :fetch-suggestions="hangciSearch"
                    @select="modhangciChange"
                    @blur="modhangciChange"
                  >
                    <template slot-scope="{ item }">
                      <div>{{ item.value = item.sailNum }}</div>
                    </template>
                  </el-autocomplete>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="港区：">
              <el-input v-model="publicData24.port" style="width: 170px; height: 28px; line-height: 28px;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
              <el-form-item label="船代：">
                <!-- <el-input :disabled="true" style="width: 170px; height: 28px; line-height: 28px; color: #409eff;" v-model="publicData24.shipAgencyName"></el-input> -->
                <el-select v-model="publicData24.shipAgencyName" style="width: 170px; height: 28px; line-height: 28px;" @change="shipAgencyNameChange" clearable filterable placeholder="船代选择">
                <el-option
                  v-for="item in shipAgencyNameOptions"
                  :key="item.zjm"
                  :label="item.zjm"
                  :value="item.shipAgencyName"
                ></el-option>
              </el-select>
              </el-form-item>
            </el-col>
          <el-col :span="8">
            <el-form-item label="船公司：">
              <!-- <el-select v-model="publicData24.company" filterable placeholder="请选择" @change="companyChange">
                  <el-option
                    v-for="item in chuangongshiOptions"
                    :key="item.boatAgentName"
                    :label="item.boatAgentName"
                    :value="item.boatAgentName"
                  ></el-option>
                </el-select> -->
                <el-select v-model="publicData24.company" style="width: 170px; height: 28px; line-height: 28px;" @change="companyChange" clearable filterable placeholder="船公司选择">
                  <el-option
                    v-for="item in chuangongshiOptions"
                    :key="item.nameCncode"
                    :label="item.nameCncode"
                    :value="item.nameCn"
                  ></el-option>
                </el-select>
                <!-- <el-input style="width: 170px; height: 28px; line-height: 28px; color: #409eff;" :disabled="true" v-model="publicData24.company"></el-input> -->
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="箱号：">
              <el-input style="width: 170px; height: 28px; line-height: 28px;" v-model="publicData24.carton"></el-input>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="申请时间：">
              <el-date-picker
              style="width: 170px; height: 28px; line-height: 28px;"
                value-format="yyyy-MM-dd HH:mm"
                v-model="publicData24.applyTime"
                type="datetime"
                placeholder="选择日期时间"
              ></el-date-picker>
            </el-form-item>
          </el-col>

          <!-- <el-col :span="8">
            <el-form-item label="业务员手机">
              <el-input disabled="disabled" value="后台读取"></el-input>
            </el-form-item>
          </el-col> -->
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="放箱备注：">
              <el-input type="textarea" v-model="publicData24.mome"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="操作员">
              <!-- <el-input style="width: 170px; height: 28px; line-height: 28px;" v-model="publicData24.putBoxName"></el-input> -->
              <el-select style="width: 170px; height: 28px; line-height: 28px;" @change="salemanChange" v-model="publicData24.putBoxName" filterable clearable placeholder="操作员选择">
              <el-option
                v-for="item in putBoxNameOptions"
                :key="item.fullName"
                :label="item.fullName"
                :value="item.salesmanId"
              ></el-option>
            </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="放箱员：">
              <el-select style="width: 170px; height: 28px; line-height: 28px;" v-model="publicData24.putBoxPartId" filterable clearable placeholder="放箱员选择">
              <el-option
                v-for="item in putBoxPartOptions"
                :key="item.fullName"
                :label="item.fullName"
                :value="item.salesmanId"
              ></el-option>
            </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="退款金额：">
              <el-input style="width: 170px; height: 28px; line-height: 28px;" filterable v-model="publicData24.refundMoney" @focus="emptyMon()" @blur="romoveMon()" placeholder="请输入退款金额"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="退款时间：">
              <el-date-picker style="width: 170px; height: 28px; line-height: 28px;" value-format="yyyy-MM-dd HH:mm:ss" v-model="publicData24.refundDate" type="datetime" placeholder="选择日期时间"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="margin: 5px 0 5px 0">
        <el-button @click="newBoxModel" type="primary" size="small">新建箱型</el-button>
      </el-row>
      <el-table border :data="viewBoxList" style="width: 100%">
        <el-table-column align="center" type="index" label="序号">
        </el-table-column>
        <!-- <el-table-column align="center" label="尺寸">
          <template slot-scope="scope">
            <el-select v-model="scope.row.boxSize" placeholder="请选择">
              <el-option label="20" value="20"></el-option>
              <el-option label="40" value="40"></el-option>
              <el-option label="45" value="45"></el-option>
              <el-option label="10" value="10"></el-option>
              <el-option label="53" value="53"></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column align="center" label="箱型">
          <template slot-scope="scope">
            <el-select v-model="scope.row.boxType" placeholder="请选择">
              <el-option label="GP" value="GP"></el-option>
              <el-option label="HC" value="HC"></el-option>
              <el-option label="FR" value="FR"></el-option>
              <el-option label="HT" value="HT"></el-option>
              <el-option label="OT" value="OT"></el-option>
              <el-option label="RF" value="RF"></el-option>
              <el-option label="RH" value="RH"></el-option>
              <el-option label="TK" value="TK"></el-option>
              <el-option label="GH" value="GH"></el-option>
              <el-option label="HT" value="HT"></el-option>
              <el-option label="HCHT" value="HCHT"></el-option>
              <el-option label="GPHT" value="GPHT"></el-option>
              <el-option label="HCFR" value="HCFR"></el-option>
              <el-option label="HCOT" value="HCOT"></el-option>
            </el-select>
          </template>
        </el-table-column> -->
        <el-table-column label="箱型" align="center">
          <template slot-scope="scope">
            <el-select v-model="scope.row.type" placeholder="请选择">
              <el-option label="20GP" value="20GP"></el-option>
              <el-option label="40GP" value="40GP"></el-option>
              <el-option label="40HC" value="40HC"></el-option>
              <el-option label="20FR" value="20FR"></el-option>
              <el-option label="20FQ" value="20FQ"></el-option>
              <el-option label="20HT" value="20HT"></el-option>
              <el-option label="20OT" value="20OT"></el-option>
              <el-option label="20OH" value="20OH"></el-option>
              <el-option label="20RF" value="20RF"></el-option>
              <el-option label="20RH" value="20RH"></el-option>
              <el-option label="20TK" value="20TK"></el-option>
              <el-option label="20GH" value="20GH"></el-option>
              <el-option label="20PF" value="20PF"></el-option>
              <el-option label="20HQ" value="20HQ"></el-option>
              <el-option label="40FR" value="40FR"></el-option>
              <el-option label="40FQ" value="40FQ"></el-option>
              <el-option label="40HT" value="40HT"></el-option>
              <el-option label="40HCHT" value="40HCHT"></el-option>
              <el-option label="40GPHT" value="40GPHT"></el-option>
              <el-option label="40OT" value="40OT"></el-option>
              <el-option label="40OH" value="40OH"></el-option>
              <el-option label="40RF" value="40RF"></el-option>
              <el-option label="40TK" value="40TK"></el-option>
              <el-option label="40RH" value="40RH"></el-option>
              <el-option label="40PF" value="40PF"></el-option>
              <el-option label="40HQ" value="40HQ"></el-option>
              <el-option label="45FR" value="45FR"></el-option>
              <el-option label="45GP" value="45GP"></el-option>
              <el-option label="45HC" value="45HC"></el-option>
              <el-option label="45HT" value="45HT"></el-option>
              <el-option label="45OT" value="45OT"></el-option>
              <el-option label="45RF" value="45RF"></el-option>
              <el-option label="45RH" value="45RH"></el-option>
              <el-option label="45TK" value="45TK"></el-option>
              <el-option label="45PF" value="45PF"></el-option>
              <el-option label="45HQ" value="45HQ"></el-option>
              <el-option label="53HC" value="53HC"></el-option>
              <el-option label="20HC" value="20HC"></el-option>
              <el-option label="10GP" value="10GP"></el-option>
              <el-option label="40HCFR" value="40HCFR"></el-option>
              <el-option label="40HCOT" value="40HCOT"></el-option>
              <el-option label="45HCOT" value="45HCOT"></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column align="center" label="箱量">
          <template slot-scope="scope">
            <el-input-number v-model="scope.row.boxnum" :min="1"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作">
          <template slot-scope="scope">
            <el-button @click="deleteModel(scope.$index)" size="mini" type="danger">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-row style="margin: 5px 0 0 0">
        <h3>应收费用</h3>
      </el-row>
        <el-form :inline="true" label-width="100px" size="mini">
          <el-form-item v-for="(item, index) in feeData" :key="index" :label="item.feeName">
              <el-input @blur="addMoenyYS(item)" style="width: 100px;" v-model="item.money"></el-input>
          </el-form-item>
        </el-form>
      <!-- </el-form> -->
      <el-row style="margin: 5px 0 0 0">
        <h3>应付费用</h3>
      </el-row>
        <el-form :inline="true" label-width="100px" size="mini">
          <el-form-item v-for="(item, index) in shipFee" :key="index" :label="item.feeName">
              <el-input @blur="addMoenyYF(item)" style="width: 100px;" v-model="item.money"></el-input>
          </el-form-item>
        </el-form>
      </el-form>
      </div>
      </div>
    </el-dialog>
  <!-- </div> -->
</template>

<script>
import { insertImportPutBox, shipAgencyPutpartId, getSalesman, SearchUserInfo, boatNameList, getShipAgencyList, blnoGetBoatCompany, getBoatInfo, boatCompanyList, getJKXBoatInfo } from '../api/importPutBox'
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      myVisible: this.visible,
      loadingViewAll: false,
      loadingView: false,
      publicData24: {
        company: '',
        boat: '',
        timeArrival: '',
        voyage: '',
        port: '',
        mome: '',
        refundMoney: '',
        refundDate: '',
        shipAgencyName: '',
        boatAgentId: '',
        shipAgencyId: '',
        boxState: '0',
        putBoxName: '',
        salesmanId: '',
        customerId: '',
        putBoxPartId: '',
        applyTime: '',
        boxList: [],
        boxFeeStatus: 1,
        boxCostList: [],
        shipFee: []
      },
      viewBoxList: [],
      tableData2: [],
      tableData3: [],
      hangciArr: [],
      feeData: [
        {feeName: '打单费', money: ''},
        {feeName: '提箱费', money: ''},
        {feeName: '中理货费', money: ''},
        {feeName: '外理货费', money: ''},
        {feeName: '港建费', money: ''},
        {feeName: '港杂费', money: ''},
        {feeName: '台头费', money: ''},
        {feeName: '计划费', money: ''},
        {feeName: '服务费', money: ''},
        {feeName: '快递费', money: ''},
        {feeName: '超期费', money: ''},
        {feeName: '坏污箱费', money: ''},
        {feeName: '滞纳金', money: ''},
        {feeName: '其他', money: ''}
      ],
      shipFee: [
        {feeName: '打单费', money: ''},
        {feeName: '提箱费', money: ''},
        {feeName: '中理货费', money: ''},
        {feeName: '外理货费', money: ''},
        {feeName: '港建费', money: ''},
        {feeName: '港杂费', money: ''},
        {feeName: '台头费', money: ''},
        {feeName: '计划费', money: ''},
        {feeName: '服务费', money: ''},
        {feeName: '快递费', money: ''},
        {feeName: '超期费', money: ''},
        {feeName: '坏污箱费', money: ''},
        {feeName: '滞纳金', money: ''},
        {feeName: '其他', money: ''}
      ],
      chuangongshiOptions: [],
      shipAgencyNameOptions: [],
      yardOptions: [],
      putBoxNameOptions: [],
      chuanmingOptions: [],
      putBoxPartOptions: [],
      kehuOptions: [],
      models: [
        {boxType: '', boxQuantity: 1}
      ]
    }
  },
  watch: {
    myVisible (value) {
      this.$emit('visibleChange', value)
    },
    visible (value) {
      this.myVisible = value
    }
  },
  async mounted () {
    await this.getKehu()
    this.getBoatCom()
    this.getBoat()
    this.getShipName()
    this.getPutBoxPartList()
    this.getPutBoxPartTList()
  },
  // created () {
  //   this.keyupSubmit()
  // },
  methods: {
    async getBoatIofnJH () {
      if (this.publicData24.boat === '') {
        this.$message({
          message: '请输入船名',
          type: 'warning',
          duration: 1500
        })
      } else {
        this.loadingViewAll = true
        let res = await getJKXBoatInfo({
          boatName: this.publicData24.boat
        })
        if (res.status === 200) {
          this.chuanmingOptions = res.data
          this.loadingViewAll = false
        } else {
          this.loadingViewAll = false
          this.$message({
            message: res.msg,
            type: 'warning',
            duration: 1500
          })
        }
      }
    },
    async hangciSearch (queryString, cb) {
      // this.newchukou.hangci = queryString
      // let res = await getBoatInfo({
      //   content: this.modifyMod.chuanming
      // });
      var restaurants = this.hangciArr
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants
      // 调用 callback 返回建议列表的数据
      cb(results)
      // let {data, status} = res
      //   let restaurants = res
      //   clearTimeout(this.timeout)
      //   this.timeout = setTimeout(() => {
      //       cb(restaurants)
      //   }, 50 * Math.random())
      // var restaurants = this.chuanmingOptions
      // var results = queryString
      //   ? restaurants.filter(this.createFilter(queryString))
      //   : restaurants
      // // 调用 callback 返回建议列表的数据
      // cb(results)
    },
    customerChange (val) {
      this.kehuOptions.map((item, index, arr) => {
        if (val === item.UserId) {
          this.publicData24.salesmanId = item.salesmanId
          this.publicData24.putBoxName = item.salesmanId
        }
      })
    },
    salemanChange (val) {
      this.publicData24.putBoxName = val
      this.putBoxNameOptions.map((item, index, arr) => {
        if (val === item.salesmanId) {
          this.publicData24.salesmanId = item.salesmanId
        }
      })
    },
    // 获取放箱员信息
    async getPutBoxPartTList () {
      let res = await getSalesman({
        num: 1000000,
        page: 1,
        userType: 9,
        state: 1
      }
      )
      this.putBoxPartOptions = res.data
    },
    async getPutBoxPartList () {
      let res = await getSalesman({
        num: 1000000,
        page: 1,
        userType: 8,
        state: 1
      }
      )
      this.putBoxNameOptions = res.data
    },
    // keyupSubmit () {
    //   document.onkeydown = e => {
    //     let _key = window.event.keyCode
    //     if (_key === 13) {
    //       this.add()
    //     }
    //   }
    // },
    // duichangId (item) {
    //   this.publicData24.yardId = item.yardId
    // },
    addMoenyYS (row) {
      if (row.feeName === '港杂费') {
        this.shipFee.map((item, index, arr) => {
          if (item.feeName === '港杂费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '港建费') {
        this.shipFee.map((item, index, arr) => {
          if (item.feeName === '港建费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '超期费') {
        this.shipFee.map((item, index, arr) => {
          if (item.feeName === '超期费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '坏污箱费') {
        this.shipFee.map((item, index, arr) => {
          if (item.feeName === '坏污箱费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '滞纳金') {
        this.shipFee.map((item, index, arr) => {
          if (item.feeName === '滞纳金') {
            item.money = row.money
          }
        })
      }
    },
    addMoenyYF (row) {
      if (row.feeName === '港杂费') {
        this.feeData.map((item, index, arr) => {
          if (item.feeName === '港杂费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '港建费') {
        this.feeData.map((item, index, arr) => {
          if (item.feeName === '港建费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '超期费') {
        this.feeData.map((item, index, arr) => {
          if (item.feeName === '超期费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '坏污箱费') {
        this.feeData.map((item, index, arr) => {
          if (item.feeName === '坏污箱费') {
            item.money = row.money
          }
        })
      }
      if (row.feeName === '滞纳金') {
        this.feeData.map((item, index, arr) => {
          if (item.feeName === '滞纳金') {
            item.money = row.money
          }
        })
      }
    },
    async getBoatComBlon () {
      this.loadingView = true
      let numId = ''
      if (this.publicData24.customerId === '') {
        numId = '0'
      } else {
        numId = this.publicData24.customerId
      }
      let res = await blnoGetBoatCompany({
        blno: this.publicData24.blno,
        imo: 1,
        customerId: numId
      })
      if (res.status === 201) {
        this.loadingView = false
        this.publicData24.company = ''
        this.publicData24.shipAgencyName = ''
        this.publicData24.boatAgentId = ''
        this.publicData24.shipAgencyId = ''
        this.publicData24.port = ''
        this.publicData24.boat = ''
        this.publicData24.voyage = ''
        this.publicData24.timeArrival = ''
        this.publicData24.putBoxPartId = ''
        this.publicData24.putBoxName = ''
        // this.publicData24.carton = ''
        this.feeData[0].money = ''
        this.feeData[1].money = ''
        this.shipFee[0].money = ''
        this.shipFee[1].money = ''
        this.$notify.error({
          title: '获取失败',
          message: '未找到相关信息!'
        })
      } else {
        this.loadingView = false
        this.publicData24.boxList = res.data[0].boxInfo
        this.publicData24.company = res.data[0].boatAgent.nameCncode
        this.publicData24.shipAgencyName = res.data[0].boatAgent.text
        this.publicData24.putBoxPartId = res.data[0].putBoxPartId
        this.publicData24.putBoxName = res.data[0].boatAgent.putBoxName
        this.publicData24.boatAgentId = res.data[0].boatAgent.boatComId
        this.publicData24.shipAgencyId = res.data[0].boatAgent.shipAgencyId
        if (res.data[0].boxInfo.length === 0) {
          return
        } else {
          this.publicData24.port = res.data[0].boxInfo[0].term
          this.publicData24.boat = res.data[0].boxInfo[0].vesselName
          this.publicData24.voyage = res.data[0].boxInfo[0].voyageNo
          this.publicData24.timeArrival = res.data[0].boxInfo[0].inTime
          // this.publicData24.carton = res.data[0].boxInfo[0].carton
        }
        this.viewBoxList = res.data[0].boxNum
        this.feeData[0].money = res.data[0].importBillFee
        this.feeData[1].money = res.data[0].importPickBoxFee
        this.shipFee[0].money = res.data[0].expndBillFee
        this.shipFee[1].money = res.data[0].expndPickBoxFee
      }
    },
    companyChange (a) {
      this.chuangongshiOptions.map((item, index, arr) => {
        if (a === item.nameCn) {
          this.publicData24.boatAgentId = item.boatComId
        }
      })
    },
    // 获取船公司
    async getBoatCom () {
      let res = await boatCompanyList({
        nameCncode: ''
      })
      this.chuangongshiOptions = res.data
    },
    // 获取船代
    async getShipName () {
      let res = await getShipAgencyList()
      this.shipAgencyNameOptions = res.data
    },
    // 船代改变事件
    async shipAgencyNameChange (a) {
      this.shipAgencyNameOptions.map((item, index, arr) => {
        if (a === item.shipAgencyName) {
          this.publicData24.shipAgencyId = item.shipAgencyId
          this.publicData24.putBoxPartId = item.putBoxPartId
        }
      })
      // let res = await shipAgencyPutpartId({
      //   shipAgencyId: this.publicData24.shipAgencyId
      // })
      // this.publicData24.salesmanId = res.data[0].salesmanId
      // this.publicData24.putBoxName = res.data[0].putBoxName
    },
    // 获取堆场
    // async getYard () {
    //   let res = await yardList({
    //     code: '',
    //     yardName: '',
    //     yardArea: '',
    //     phoneNumber: ''
    //   })
    //   this.yardOptions = res.data
    // },
    // 获取船名
    async getBoat () {
      let res = await boatNameList({
        content: ''
      })
      this.chuanmingOptions = res.data
    },
    async chuanmingChange (val) {
      this.publicData24.boat = val.shipName
      this.publicData24.voyage = val.voyage
      this.publicData24.port = val.berthName
      // this.publicData24.openTime = ''
      // this.publicData24.endTime = ''
      // let res = await getBoatInfo({
      //   boatName: this.publicData24.boat
      // })
      // if (res.status === 200) {
      // this.hangciArr = res.data
      // this.publicData24.voyage = res.data[0].sailNum
      // console.log(res.data[0].portArea, '77788')
      // this.publicData24.port = res.data[0].portArea
      // }

      // this.publicData24.openTime = res.data[0].openPortTime
      // this.publicData24.endTime = res.data[0].closePortTime
    },
    modhangciChange (val) {
      // this.newchukou.hangci = val.sailNum
      this.publicData24.port = ''
      this.hangciArr.map((item, index, arr) => {
        if (item.sailNum === val.sailNum) {
          this.publicData24.port = item.portArea
        }
      })
    },
    // duiSearch (queryString, cb) {
    //   var restaurants = this.yardOptions
    //   var results = queryString
    //     ? restaurants.filter(this.createFilter(queryString))
    //     : restaurants
    //   cb(results)
    // },
    async shipSearch (queryString, cb) {
      // var restaurants = this.chuanmingOptions
      // var results = queryString
      //   ? restaurants.filter(this.createFilter(queryString))
      //   : restaurants
      // cb(results)
      let res = await boatNameList({
        content: queryString
      })
      let {data, status} = res.data
      let restaurants = res.data
      clearTimeout(this.timeout)
      this.timeout = setTimeout(() => {
        cb(restaurants)
      }, 50 * Math.random())
    },
    createFilter (queryString) {
      return restaurant => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        )
      }
    },
    // 删除箱型
    deleteModel (index) {
      this.viewBoxList.splice(index, 1)
    },
    // 新建箱型
    newBoxModel () {
      this.viewBoxList.push({type: '', boxnum: 1})
    },
    // async getFee () {
    //   let res = await GetputBoxFee()
    //   this.feeData = res.data
    // },
    async getKehu () {
      let res = await SearchUserInfo({
        num: 1000000,
        page: 1
      })
      this.kehuOptions = res.data
    },
    clear () {
      this.publicData24.customerId = ''
      this.publicData24.timeArrival = ''
      this.publicData24.port = ''
      this.publicData24.blno = ''
      this.publicData24.boat = ''
      this.publicData24.voyage = ''
      this.publicData24.company = ''
      this.publicData24.shipAgencyName = ''
      this.publicData24.mome = ''
      this.publicData24.applyTime = ''
      this.publicData24.putBoxName = ''
      this.publicData24.putBoxPartId = ''
      this.publicData24.refundMoney = ''
      this.publicData24.refundDate = ''
      this.publicData24.boxList = []
      this.viewBoxList = []
      this.feeData.map((item, index) => {
        item.money = ''
      })
      this.shipFee.map((item, index) => {
        item.money = ''
      })
    },

    async add () {
      if (this.publicData24.boxList.length === 0) {
        this.publicData24.boxList = this.viewBoxList
      }
      if (this.publicData24.applyTime === '' || this.publicData24.applyTime === null) {
        let date1 = new Date()
        this.publicData24.applyTime = date1.getFullYear() +
        '-' +
        (date1.getMonth() + 1 < 10
          ? '0' + (date1.getMonth() + 1)
          : date1.getMonth() + 1) +
        '-' +
        (date1.getDate() < 10 ? '0' + date1.getDate() : date1.getDate()) +
        ' ' +
        (date1.getHours() < 10 ? '0' + date1.getHours() : date1.getHours()) +
        ':' +
        (date1.getMinutes() < 10 ? '0' + date1.getMinutes() : date1.getMinutes())
      } else {

      }
      this.publicData24.boxCostList = this.feeData
      this.publicData24.shipFee = this.shipFee
      this.loadingView = true
      let res = await insertImportPutBox(this.publicData24)
      if (res.status === 200) {
        this.clear()
        this.$emit('childMethod')
        this.$store.commit('hide_new_order_dialog')
        this.loadingView = false
        this.$notify({
          title: '新增成功',
          message: '新增成功',
          type: 'success',
          duration: 1000
        })
      } else {
        this.loadingView = false
        this.$notify.error({
          title: '添加失败',
          message: res.msg,
          duration: 1000
        })
      }
    },
    close () {
      this.myVisible = false
    }
  }
}
</script>
<style lang="less">
.el-autocomplete-suggestion {
    width: auto !important;
}
  .new-import-order-dialog {
    // position: relative;
    .el-input.is-disabled .el-input__inner {
      color: #409eff;
      width: 170px;
      height: 28px;
      line-height: 28px;
    }
    .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
      margin-bottom: 5px;
    }
    .dialog-footer {
      // position: absolute;
      // bottom: 0px;
      text-align: right;
      margin-bottom: 5px;
    }
    .el-dialog__body {
      padding: 5px 20px;
    }
  }
</style>
